<div nz-row nzGutter="16">
  
    <div nz-col nzXs="24" nzMd="12">
      <nz-card [nzTitle]="recentTitle" [nzBordered]="false" class="ant-card__body-nopadding">
        <ng-template #recentTitle>
        最新设备
          <small class="text-sm font-weight-normal">Venenatis portauam Inceptos ameteiam</small>
        </ng-template>
        <div nz-row [nzJustify]="'center'" [nzAlign]="'middle'" class="py-sm pr-md bg-grey-lighter-h point" *ngFor="let item of todoData">
          <div nz-col [nzSpan]="4" class="text-center">
            <nz-avatar [nzSrc]="'./assets/tmp/img/' + item.avatar + '.png'"></nz-avatar>
          </div>
          <div nz-col [nzSpan]="20">
            <strong>{{ item.name }}</strong>
            <p class="mb0">{{ item.content }}</p>
          </div>
        </div>
      </nz-card>
    </div>
    <div nz-col nzXs="24" nzMd="12">
      <nz-card nzTitle="最新租户" [nzBordered]="false" class="ant-card__body-nopadding">
        <div nz-row [nzJustify]="'center'" [nzAlign]="'middle'" class="py-sm pr-md bg-grey-lighter-h point" *ngFor="let item of todoData">
          <div nz-col [nzSpan]="4" class="text-center">
            <nz-avatar [nzSrc]="'./assets/tmp/img/' + item.avatar + '.png'"></nz-avatar>
          </div>
          <div nz-col [nzSpan]="18">
            <strong>{{ item.name }}</strong>
            <p [class.text-deleted]="item.completed" class="mb0">{{ item.content }}</p>
          </div>
          <div nz-col [nzSpan]="2" class="text-right pr-md">
            <i nz-dropdown [nzDropdownMenu]="todoMenus" nzPlacement="topRight" nz-icon nzType="ellipsis" class="rotate-90"></i>
            <nz-dropdown-menu #todoMenus="nzDropdownMenu">
              <ul nz-menu>
                <li nz-menu-item *ngIf="item.completed" (click)="item.completed = false">Active</li>
                <li nz-menu-item *ngIf="!item.completed" (click)="item.completed = true">Completed</li>
                <li nz-menu-item (click)="todoData.splice(todoData.indexOf(item), 1)">Delted</li>
              </ul>
            </nz-dropdown-menu>
          </div>
        </div>
      </nz-card>
    </div>